<template>
	<view class="container">
		<view class="padding-sm">
			<view class="round flex justify-between align-center bg-color tabs text-df text-white">
				<view :class="{on:type==1}" class="tab round text-center" @click="checkType(1)">

					服务商
				</view>
				<view :class="{on:type==2}" class="tab round text-center" @click="checkType(2)">

					我的申请
				</view>
				<view :class="{on:type==3}" class="tab round text-center" @click="checkType(3)">

					已邀请
				</view>
			</view>
		</view>
		<!-- </view> -->

		<view @click="toPage('/pagesA/pages/serviceUserList/serviceUserInfo?id='+item.id)"
			class="padding margin-sm bg-white flex justify-start radius10" v-for="(item,index) in list" :key='index'>
			<image :src="item.logo" mode="" class="round cu-avatar"></image>
			<!-- @click.stop="toPage('/filePage/pages/detail-or-order/detail-or-order')" -->
			<view class="margin-left-sm f-grow1">
				<view class="flex justify-between align-center">
					<view class="text-bold text-181818 text-xl">
						{{item.shopName}}
					</view>

				</view>
				<view class="flex  justify-between align-center text-sm text-666 margin-top-sm">
					<view class="flex align-center text-sm text-666">
						<view>
							工人数量<text class="text-15 margin-left-xs">{{item.workerCount}}</text>
						</view>
						<view class="margin-left">
							工单数量<text class="text-15 text-FF3636 margin-left-xs"> {{item.serviceOrderCount}}</text>
						</view>
					</view>
					<view v-if='type==3'>
						<block v-if='item.applyAuditStatus==1'>审核通过</block>
						<block v-else-if='item.applyAuditStatus==2'>审核不通过</block>
						<block v-else>未审核</block>
					</view>
					<view v-if='type==2'>
						<block v-if='item.applyAuditStatus==1'>邀请通过</block>
						<block v-else-if='item.applyAuditStatus==2'>邀请不通过</block>
						<block v-else>邀请中</block>
					</view>
				</view>
				<view class="flex justify-between align-center text-sm text-999" style="margin-top: 60rpx;">
					<view class="">
						创建时间 {{item.createTime}}
					</view>
					<view class="margin-left">
						电话:{{item.userMobile}}
					</view>
				</view>
				<view class="margin-top flex justify-end align-center">
				<!-- 	<button v-if='type==2' @click.stop="add_operator(item)"
						class="bg-color text-13 text-white btn round">
						申请

					</button> -->
					<button v-if='type==2 &&item.applyAuditStatus==0' @click.stop="verify(item)"
						class="bg-color text-13 text-white btn round">
						审核

					</button>
				</view>
			</view>
		</view>
		<button @click="toPage('/pagesA/pages/serviceUserList/add-service-list/add-service-list?shopCenterId=' + shopId)"
			class="padding bg-linear-FF416C text-white round footer flex justify-center align-center">
			<image :src="baseUrl + '/static/attention2.png'" mode="" class="margin-right-xs"></image>
			邀请服务商
		</button>
		<uni-load-more :status="loading" />
	</view>
</template>

<script>
	import BetterPull from "@/common/libs/BetterPull";
	export default {
		mixins: [
			BetterPull({
				async getPage(page, done) {
					this.loading = "loading";
					let param;
					if (this.type == 1) {
						this.url = this.$api.getMyShopUser
						param = {
							pageNum: page,
							pageSize: 10,
							shopType: 1,
							parentId: this.shopId
						}
					} else if (this.type == 2) {
						this.url = this.$api.applyToCenterList
						param = {
							pageNum: page,
							pageSize: 10,
							selectType: 1,
							parentApplyId: this.shopId
						}
					} else {
						this.url = this.$api.applyToCenterList
						param = {
							pageNum: page,
							pageSize: 10,
							selectType: 2,
							parentApplyId: this.shopId
						}
					}
					const [err, res] = await this.$get(
						this.url,
						param
					);
					if (res) {
						// console.log(res)
						var data = res.data.list;
						// this.total = res.data.total;
						done(data);
						if (data.length < 10) {
							this.loading = "noMore";
						} else {
							this.loading = "more";
						}
						// console.log(this.loading)
					}
					if (err) {
						done([]);
						this.loading = "noMore";
					}
				},
			}),
		],
		onLoad(options) {
			// if (options.issue) {
			// 	this.issue = options.issue
			// }
			if (options.shopId) {
				this.shopId = options.shopId
			}
			if (options.type) {
				this.type = options.type
			}
		},
		data() {
			return {
				baseUrl: this.$config.baseUrl,
				loading: 'more',
				type: 1,
				url: '',
				shopId: ''
			};
		},
		methods: {
			toPage(url) {
				this.$util.openNewPage(url)
			},
			checkType(e) {
				console.log(e)
				this.type = e
				this.list = []
				uni.startPullDownRefresh()
			},
			add_operator(e) {
				// console.log('11111111')
				uni.showModal({
					title: "提示",
					content: "确定要申请吗？",
					cancelText: "取消",
					confirmText: "确定",
					success: (res) => {
						if (res.confirm) {
							this.sur_operator(e)
						}
					},
				})

			},
			async sur_operator(e) {
							const [err, rs] = await this.$get(this.$api.applyToCenter, {
								shopId: this.shopId,
								shopCenterId: e.id
							})
							if (rs) {
								this.$util.msg(rs.message)
								this.list = []
								uni.startPullDownRefresh()
								// uni.redirectTo({
								// 	url:'/filePage/pages/operator-list/operator-list?shopId=' + uni.getStorageSync('userInfo').shopIdApply + '&type=2'
								// })
								// console.log(rs)
							}
			},
			verify(item) {
				const that = this
				uni.showModal({
					content: '你确定同意加入该运营商吗',
					success: function(res) {
						if (res.confirm) {
							const data = {
								auditUserId: uni.getStorageSync('userId'),
								id: item.applyAuditId,
								auditStatus: 1
							}
							that.$jsonPost(that.$api.auditForShop, data).then(res => {
								const [err, rs] = res
								if (rs) {
									that.$util.msg(rs.message)
									setTimeout(() => {
										uni.navigateBack({
			
										})
									}, 1000)
								}
							})
			
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.tabs {
		padding: 4rpx;

		.tab {
			width: 350rpx;
			padding: 16rpx;
		}

		.on {
			background: #fff;
			color: #ED7200;
			font-weight: bold;
		}
	}

	.footer {
		position: fixed;
		left: 20rpx;
		right: 20rpx;
		bottom: 98rpx;

		image {
			width: 48rpx;
			height: 48rpx;
		}
	}

	.btn {
		padding: 20rpx 50rpx;
	}
</style>
